import React from 'react';
import { Form, Modal, Checkbox } from 'antd';
import { history } from 'umi'
import { pressTaskFront } from '../../../services';
import { FORM_DEFAULT_LAYOUT, MODAL_DEFAULT_PARAM, MODAL_FORCE_PARAM } from '../config';

const TurnDoingFalseModal = ({ form, taskId, taskRecord, visible, setVisible, onOk }) => {
    // console.log('TurnDoingFalseModal -> taskId', taskId, taskRecord);
    const { frontTaskId, frontTaskNo = '', frontTaskName = '' } = taskRecord;
    const [confirmLoading, setConfirmLoading] = React.useState(false);
    const handleOk = () => {
        const { pushMsg } = form.getFieldsValue();
        if (pushMsg.length <= 0) {
            setVisible(false);
        } else {
            setConfirmLoading(true);
            pressTaskFront(taskId)
                .then(res => {
                    const { code } = res;
                    if (code === 10000) {
                        if (onOk) onOk();
                        setVisible(false);
                    }
                })
                .finally(() => {
                    setConfirmLoading(false);
                });
        }
    };

    return (
        <Modal
            {...MODAL_DEFAULT_PARAM}
            title="转进行中"
            width={640}
            visible={visible}
            confirmLoading={confirmLoading}
            onOk={handleOk}
            destroyOnClose
            onCancel={() => setVisible(false)}
            {...MODAL_FORCE_PARAM}
        >
            <Form {...FORM_DEFAULT_LAYOUT} labelCol={{ span: 10 }} wrapperCol={{ span: 12 }}>
                <div style={{ lineHeight: 1.5, textAlign: 'center', fontSize: 16, marginBottom: 24, marginTop: 16 }}>
                    前置任务未完成，无法转至进行中！
                </div>
                <Form.Item label="前置任务名称">
                    <div style={{ lineHeight: 1.5, padding: '8px 0 0' }}>
                        <a
                            onClick={e => {
                                e.preventDefault();
                                setVisible(false);
                                history.push({
                                    pathname: '/work/task/taskdetail',
                                    query: { id: frontTaskId || '' },
                                    state: { tabRoute: true, tabRefresh: true }
                                });
                            }}
                        >
                            {frontTaskName || ''}
                        </a>
                    </div>
                </Form.Item>
                <Form.Item label="前置任务编号">{frontTaskNo}</Form.Item>
                <Form.Item label="是否向前置任务执行人发送催办通知">
                    {form.getFieldDecorator('pushMsg', {
                        initialValue: ['1']
                    })(
                        <Checkbox.Group>
                            <Checkbox value="1">是</Checkbox>
                        </Checkbox.Group>
                    )}
                </Form.Item>
            </Form>
        </Modal>
    );
};

export default Form.create()(TurnDoingFalseModal);
